<template>
  <el-dialog v-model="props.visiable" title="编辑货品信息" :before-close="closedFn">
    <el-form >
    <el-form-item label="商品货号：">
      <el-input
      v-model="input"
      placeholder="按sku编号搜索"
      class="input-with-select"
    >
      <template #append>
        <el-button :icon="Search" />
      </template>
    </el-input>
    </el-form-item>
      <el-form-item >
          <div class="gray"></div>
          <el-table border style="width: 100%; margin-top: 20px; margin-bottom: 20px">
            <el-table-column label="SKU编号" />
            <el-table-column label="商品库存" />
            <el-table-column label="库存预警值" />
            <el-table-column label="SKU编号" />
            <el-table-column label="操作" />
          </el-table>
        </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="closedFn">取消</el-button>
        <el-button type="primary" @click="onConfirm">
          确定
        </el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import { reactive, ref,defineProps,withDefaults } from 'vue'
import { Search } from '@element-plus/icons-vue'
const formLabelWidth = '140px'
let input = ref('')
let emits = defineEmits(["getvisiable","confirm"]);
// 确定
let onConfirm = () => {
    // console.log(ownForm.value);
    // 将参数返回给父级 ，让父级发请求完成功能
    emits('confirm', null)
}
const closedFn = () => {
  //清空 实际上是点击取消的时候,将ownForm恢复成备份的值
  // ownForm.value = { ...originForm.value } 
  emits("getvisiable", false);
};
let props = withDefaults (
  defineProps<{
    visiable: boolean;
  }>(),
  {
    visiable: true,
  }
);

</script>

<style lang="scss" scoped>
.input-with-select{
  width: 230px;
}
</style>
